<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/style.css" />
		<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
		<script type="text/javascript" src="js/assist.js" ></script>
	</head>
	<body>
		<button id="btn1">匹配所有form表单下的input标签</button>
		<button id="btn2">匹配:text</button> 
		<button id="btn3">匹配按钮</button> 
		<button id="btn4">匹配不可用</button> 
		<button id="btn5">匹配第一个隐藏的input元素</button> 
		<button id="btn6">匹配已选中元素</button> 
		<button id="btn7">匹配未选中元素</button>
		<form><input type="button" value="Input Button" /> 
			<input type="checkbox" /> <input type="file" /> 
			<input type="hidden" value="12" /> <input type="image" /> 
			<input type="password" /> <input type="radio" name="sex" /> 
			<input type="radio" name="sex" /> 
			<input type="radio" name="sex" /><br/> 
			<input type="checkbox" name="hobby" /> 
			<input type="checkbox" name="hobby" /> 
			<input type="checkbox" name="hobby" /> 
			<input type="reset" /> 
			<input type="hidden" value="24" /> 
			<input type="submit" /> 
			<input type="text" />
			<select>
				<option>Option</option>
			</select> <textarea></textarea> 
			<button disabled="disabled">Button</button> 
		</form>
	</body>
	<script type="text/javascript">
		$(function(){
			$("#btn1").click(function(){
				$("form input").css("background-color","orange")
			});
			$("#btn2").click(function(){
				$("*:text").css("background-color","orange")
			});
			$("#btn3").click(function(){
				$("*:button").css("background-color","orange")
			});
			$("#btn4").click(function(){
				$("*:disabled").css("background-color","orange")
			});
			$("#btn5").click(function(){
				var value = $("input:hidden").first().val(); 
				console.log("第一个隐藏的input元素的value为："+value);
			});
			$("#btn6").click(function(){
				$("input:checked").css("background-color","orange")
			});
			$("#btn7").click(function(){
				$("input").not("checked").css("background-color","orange")
			});
		})
	</script>
</html>
